<link rel="stylesheet" type="text/css" href="../Styles/css_main.css">

<style type="text/css">

#itens_handel{
	width:98%;
	margin-top: 30px;
	margin-left: 20px;
	position:absolute;
}

.hint{
	width: 400px;	
}

.hint p {
    margin-top: 0px;
    padding-top: 6px;

}

.item {
	margin-top: 20px;
	margin-left: 20px;
	width: 140px;
	height: 156px;
	border: thick;

	border-radius: 7px;
	position:relative;
	float: left;
}

.item > img {
	padding-top: 10px;
    padding-left: 23px;
    padding-bottom: 5px;
}


</style>

<script type="text/javascript">

	function controlaItens(){

		if ($('#itens_handel').height() > 600){
			$('#principal').css('height',  $('#itens_handel').height() + 80);
		}
		
		$(".item").on("mouseover", function() {
			$(this).css("background", "#98A0A3");
		})
		
		$(".item").on("mouseout", function() {
			$(this).css("background", "#CCCCCC");
		})
		
		$(".item").on("click", function() {
			exemplar_id = $(this).prop("id");
			item_id = $('#' + exemplar_id + '_cdItem').val();
			p_nome_user = $('#' + exemplar_id + ' p').html();
			img_src = $('#' + exemplar_id + ' img').prop("src");
			nome_exemplar = $('#' + exemplar_id + '_nome_exemplar').html(); 
			plataforma_id = $('#' + exemplar_id + '_cd_plataforma').val();

			exibe_detalhe_exemplar_handel(exemplar_id, item_id, p_nome_user, img_src, nome_exemplar, plataforma_id, $(this).offset().top);

		})
		
	}
	
</script>

<div id="busca_item">
	<select name="filtro_busca" id="filtro_busca" class="select_busca" >
        <option selected>Categoria</option>
        <?php
		
		  require_once ('../Controller/busca_categorias.php');
		  
		  for ($x = 1; $x <= count($categorias); $x++) {
		  	echo '<option value="'.$x.'">'.$categorias[$x].'</option>';
		  }		  
		  ?>
		  </select>
    </select>
    
	<input type="text" name="q" id="q" style="width: 70%;" placeholder = "  Busca nos itens do Handel" class="busca">
    
</div>

<div id="itens_handel">

<?php 

	require_once ('../Controller/busca_itens_handel.php');
	require_once ('detalhe_exemplar_handel.php');

	function listaItens($busca){
		
		global $exemplares_handel;
				
		if(empty($exemplares_handel)) {
		
			echo '<div id="semitens" class="centro_azul borda-arredondada hint"><p>Vampiros roubaram os itens do nosso sistema!<p></div>';
		
		} else {
		
			for ($x = 0; $x < count($exemplares_handel); $x++) {
				
				if ($busca != ""){
					if (strripos($exemplares_handel[$x]->nmExemplar, $busca) === false){			
						continue;	
					}
				}
				   
				?> 
					<div id="<?php echo $exemplares_handel[$x]->cdExemplar; ?>" class="item">
                    	<p id="nome_user" align="center" style="font-style: italic; font-size: 11px;"><?php echo $exemplares_handel[$x]->nmUsuario; ?></p>
						<img src="../Content/itens/<?php echo $exemplares_handel[$x]->cdItem; ?>.jpg" width="90" height="90" style="border-radius: 80px;"/>
						<p id="<?php echo $exemplares_handel[$x]->cdExemplar; ?>_nome_exemplar" align="center"><?php echo $exemplares_handel[$x]->nmExemplar; ?></p>
                        <p id="nome_plataforma" align="center" style="font-style: italic;"><?php echo $exemplares_handel[$x]->nmPlataforma; ?></p>
						<input type="hidden" id="<?php echo $exemplares_handel[$x]->cdExemplar; ?>_cdItem" value="<?php echo $exemplares_handel[$x]->cdItem; ?>"  />
						<input type="hidden" id="<?php echo $exemplares_handel[$x]->cdExemplar; ?>_cd_plataforma" value="<?php echo $exemplares_handel[$x]->cdPlataforma; ?>"  />
						<input type="hidden" id="cd_wishlist" value="<?php echo $_SESSION['cd_wishlist']; ?>"  />
					</div>	
				<?php
			}				
			?>
  				<script>controlaItens();</script>
			<?php
		}
	}
		
	listaItens(@$_GET["q"]);
	
	
 ?>


</div>